<script setup>
import { ref } from 'vue'
</script>
<template>
  <div class="side-bar">
    <el-menu mode="vertical" class="el-menu-vertical-demo" :collapse="true" default-active="4">
      <el-menu-item index="4">
        <i class="iconfont icon-talk-s"></i>
        <template #title>对话</template>
      </el-menu-item>
      <el-menu-item index="1">
        <i class="iconfont icon-zhangjie"></i>
        <template #title>章节</template>
      </el-menu-item>
      <el-menu-item index="2">
        <i class="iconfont icon-jiaoseziliao"></i>
        <template #title>角色</template>
      </el-menu-item>
      <el-menu-item index="3">
        <i class="iconfont icon-peixundagang"></i>
        <template #title>大纲</template>
      </el-menu-item>
    </el-menu>
  </div>
</template>
<style lang="less" scoped>
.side-bar {
  height: 100%;
  background-color: #fff;
  border-right: 1px solid #dcdcdc;
  .iconfont {
    font-size: 20px !important;
  }
  .el-menu {
    border-right: unset;
  }
}
</style>
